<template>
	<view class="kepu">
		
		<u-navbar
		          title="科普详情"
		          :autoBack="true"
		      >
		      </u-navbar>
	<view class="content">
	<view class="title">
		{{info.title?info.title:""}}
	</view>
<view class="" style="display: flex;justify-content: space-between;">
	<view class="bianji">
		{{info.createrName?info.createrName:""}}
	</view>
	<view class="date">
		{{info.createTime?info.createTime:""}}
	</view>
</view>
		<!-- <view class="info" v-html="content">
		</view> -->
		<rich-text :nodes="content"></rich-text>
	</view>
	
	</view>
	</view>
</template>

<script>
	import homeApi from '@/api/home'
	export default {
		data() {
			return {
			newsId:"",
			info:"",
			content:""
			}

		},
		onLoad(option) {
			this.newsId=option.id
			if(this.newsId){
				this.getdetail()
			}
		},

		methods: {
  getdetail(){
  	homeApi.getnoticedetail({
  		id:this.newsId
  	}).then(res=>{
  		this.info=res.data
  		// this.content = res.data.content
  		// this.content=(this.content).replace(/\<img/gi, '<img style="width:100%;height:100%" ')
		//   this.content = res.data.content  //富文本内容
		// this.content=(this.content).replace(/<img/gi,'<img style="max-width:100%;height:auto;margin:0 auto;display:block"')
  // 		console.log(this.content)
   let txt = res.data.content  //富文本内容
      wx.formatRichText = function(html) {
        let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
          match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
          match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
          match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi,'');        
          return match;
      });
      newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
          match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
          return match;
      });
      // newContent = newContent.replace(/<br[^>]*\/>/gi, '');
       newContent = newContent.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"');
         return newContent;
  
      }
      this.content = wx.formatRichText(txt)

  	})
  }


		}
	}
</script>

<style lang="scss" scoped>
	.kepu{
		padding-top: 20rpx;
		overflow: hidden;
		padding-bottom: 100rpx;
		padding-top: 180rpx;
		.content{
			width: 95%;
			margin: 0 auto;
			line-height: 50rpx;
		
			.title{
				font-size: 38rpx;
				font-weight: bold;
				width: 100%;
				text-align: center;
				line-height: 80rpx;
				border-bottom: 1rpx solid #f7f7f7;
				padding-bottom: 15rpx;
			}
			.bianji{
				width: 70%;
				font-size: 28rpx;
				line-height: 60rpx;
				color: #728da9;
			}
			.date{
				font-size: 24rpx;
				color: #999;
				line-height: 60rpx;
			}
			.info{
				margin-top: 20rpx;
				line-height: 50rpx;
				image{
					width: 700rpx;
				}
			}
		}
		
	}
</style>
